<script >
import Son from "./Son.vue"

export default{
    name:"Parent",
    components:{Son},
    methods:{
        getSon(){
            // this.$refs.s :获取子组件对象
            // this.$refs.refName ：这就是文本框（DOM对象）。
            //  document.getElementById("username") :获取文本框（DOM对象）

            // this.$refs.refName.value = "123";
            // this.$refs.refName.type = "button";


            // this.$refs.s ：这就是Son组件（也就是Son组件里的this）。

            this.$refs.s.toSon("hi，我是父亲");

        }
    }
}

</script>

<template>
    <div>
        <h1>父子组件传值（用ref），选项式</h1>
        <h2>父组件</h2>
        <input type="button" value="获取子组件对象" @click="getSon">
        <input ref="refName" type="text" id="username" >
        <hr/>
        <Son ref="s"/>
        
    </div>
</template>

<style lang="css" scoped>
    
</style>
